<template>
  <div>

    <div class="block">
    <el-date-picker
      v-model="value1"
      type="daterange"
      range-separator="至"
      :change="queryt_interpose_scheme()"
      value-format="yyyy-M-d"
      start-placeholder="开始日期"
      end-placeholder="结束日期">
    </el-date-picker>
  </div>
      <div id="main" ref="main" style="height: 80vh; width: 100%"></div>
    <!-- <div>
      <el-table
      :data="tableData"
      style="width: 100%">
      <el-table-column prop="id" type="selection" >
        </el-table-column>
      <el-table-column
        prop="user_name"
        label="姓名"
        width="180">
      </el-table-column>
      <el-table-column
        prop="password"
        label="干预方案总量"
        width="180">
      </el-table-column>
      <el-table-column
        prop="phone"
        label="干预回访总量">
      </el-table-column>
      <el-table-column
        prop="phone"
        label="干预结束总量">
      </el-table-column>
    </el-table>
    </div> -->
    
    
</div>
</template>

<script>
import * as echarts from 'echarts';
export default {
  data(){
      return{
        value1:"",
        tableData: [],
        xAxiss:[],
      }
  },
  mounted(){
    
      this.getLoadEcharts();
  },
  created () {
    // this.queryt_interpose_scheme();
  },
  methods:{
    queryt_interpose_scheme(){
     var user= eval("(" + sessionStorage.getItem("userName") + ")")  
        this.axios.get("/api/lzh/queryt_interpose_scheme",{
          params:{
                  id:user.id,
              sdate:this.value1[0],
              enddate:this.value1[1]
          }
        }).then(result=>{
            console.log(result.data)
            this.xAxis=null;
             var gy=[];
             var hy=[];
             for(var k in result.data){
              console.log(k)
              this.xAxiss.push(k)
              gy.push(result.data[k].gysum)
              hy.push(result.data[k].hysum)
           
            }
            console.log(this.xAxiss)
            var myChart = echarts.init(this.$refs.main);
            myChart.setOption({
                            xAxis: {
                  type: 'category',
                  boundaryGap: false,
                  data:this.xAxiss
                },
                series: [
                      {
                        name: '干预方案总量',
                        type: 'line',
                        stack: 'Total',
                        data: gy
                      },
                      {
                        name: '干预回访总量',
                        type: 'line',
                        stack: 'Total',
                        data: hy
                      }
                    ]
            })
        })
    },
      getLoadEcharts(){
           var myChart = echarts.init(this.$refs.main)
        var   option = {
  title: {
    text: '干预方案        干预回访   '
  },
  tooltip: {
    trigger: 'axis'
  },
  legend: {
    data: ['干预方案总量', '干预回访总量']
  },
  grid: {
    left: '3%',
    right: '4%',
    bottom: '3%',
    containLabel: true
  },
  toolbox: {
    feature: {
      saveAsImage: {}
    }
  },
  xAxis: {
    type: 'category',
    boundaryGap: false,
    data:this.xAxiss
  },
  yAxis: {
    type: 'value',
    data:[2,4,6,8,10,12]
  },
  series: [
    // {
    //   name: '干预方案总量',
    //   type: 'line',
    //   stack: 'Total',
    //   data: [120, 132, 101, 134, 90, 230, 210]
    // }
    // , {
    //   name: '干预回访总量',
    //   type: 'line',
    //   stack: 'Total',
    //   data: [120, 132, 101, 134, 90, 230, 210]
    // }
  ]
        }
      myChart.setOption(option);
      }
  }
}

</script>

<style scoped>

</style>